<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>交集选择器</title>
    <!--
    p元素并且类名为beauty的元素
    格式:
    p.beauty{
    color:green
    }
    
    在p元素里类名为beauty即可

    id选择器理论上也可以使用交集选择器,但是不会使用,因为都是用id选择器了,可以直接使用定位标签
    由于class的值可以由多个,如果同时遇到class选择器和交集选择器,需要看样式顺序(使用后面的样式)
    交集选择器中不可能同时出现两个元素,因为一个元素不可能既是p又是span元素

    交集选择器是针对一种元素进行选择
    -->
    <style>
        .rich {
            color: gold;
        }

        .beauty {
            color: red;
        }

        p.beauty {
            color: green;
        }
    </style>
</head>
<body>
<h2 class="rich">土豪张三</h2>
<h2 class="beauty">明星李四</h2>
<hr>
<p class="beauty">小猪佩奇</p>
<p class="beauty">小猫年年</p>
</body>
</html>